<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <title>用户注册</title>
</head>

<body>
    <h3>用户注册</h3>
    <table>
        <form action="#">
            <tr>
                <td>用户名：</td>
                <td><input type="text" class="name"></td>
                <td><span class="tip"></span></td>
            </tr>
            <tr>
                <td>密码：</td>
                <td><input type="password"></td>
                <td></td>
            </tr>
            <tr>
                <td></td>
                <td><button class="btn">注册<tton></td>
                <td></td>
            </tr>
    </table>
    <script>
        //雷奥涵219971114
        $(".btn").click(function () {
            $.ajax({
                type: 'GET',
                url: 'https://mock.apifox.cn/m1/2801021-0-default/name',
                data: { name: $('.name').val() },
                dataType: 'json',
                success: function (res) {
                    if (res.name == $('.name').val()) {
                        $(".tip").text("用户名已存在");
                    }
                    else {
                        $(".tip").text("用户名有效");
                    }
                }
            })
        });
    </script>
</body>

<ml>